<!DOCTYPE html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <title>jQuery</title>
    <script src="./jquery-1.8.3.min.js"></script>
</head>
<body>
    <h1>jQuery</h1>
    <hr>
    <!-- 
		jQuery 框架
			jQuery 只是JavaScript的一个轻量级框架
			写得少, 干得多
			优势:
				开源
				便捷的选择器
				方便的DOM操作
				动画操作
				简化ajax
				兼容性
			
			
		jQuery 安装
			一般jq就两个版本
				一个测试版, 用于测试, 有良好的代码排版
				一个迷你版, 用于实际项目中, 已被精简和压缩

			经典版本: jquery-1.8.3
			最新版本: jquery-3.3.1 (至今 2019年1月)

	
		jQuery 基本语法
			$(对象).操作(function(){
				代码块
			})

		简化写法
			$(function(){
				代码块
			});
    -->

	<!-- 改变 标签h1的字体颜色 -->
	<script>
		$('h1').css('color', 'red');
	</script>


	<!-- 加载页面完成后, 弹出信息 -->
    <script>
    	$(document).ready(function(){
    		alert('加载完成');
    	})
    </script>

    <!-- 点击 button按钮, 就弹出警告框 -->
	<button id="btn"> 点我一下 </button>
	<script>
		$('#btn').click(function(){
			alert('点着玩一下');
		});
	</script>


	<!-- 改变整个网页的背景颜色 -->
	<script>
		$(function(){
			$('body').css('background', '#ccc');
		});
	</script>
</body>
</html>